<template>
    <section>
      <h2>Hello Vuex（MapMutaions）</h2>
      用户名：<input @input="setUserName($event.target.value)"/>
      学校：<input @input="setUserSchool($event.target.value)"/>
      电话：<input @input="setUserMobile($event.target.value)"/>
      年龄：<input @input="setUserAge($event.target.value)"/>
      <sub-a></sub-a>
      <sub-b></sub-b>
    </section>
  </template>
  
  <script>
  
  import subA from "./sub-a";
  import subB from "./sub-b";

//   mapMutaions在Vue3的函数组件中无法使用
  import {mapMutations} from "vuex"
  
  export default {
      components: {subA,subB},
      methods: {
        // mapMutaions返回一个全是方法属性的对象，方法就是commit响应的muation,并传递payload
        ...mapMutations(["setUserMobile","setUserName","setUserAge","setUserSchool"]),
      }
  }
  </script>
  
  <style>
  
  </style>